<template>
  <el-dialog v-model="dialogFormVisible" title='撤回出库申请' width="30%" center>
    <span>您确定要撤回出库申请吗?</span>
    <template #footer>
      <span class="dialog-footer">
        <el-button @click="dialogFormVisible = false">
          取消
        </el-button>
        <el-button type="primary" @click="WithdrawApplyProduct">
          确定
        </el-button>
      </span>
    </template>
  </el-dialog>
</template>

<script lang="ts" setup>
import { onBeforeUnmount, ref } from 'vue'
import { bus } from "../../../utils/mitt.js"
import { WithdrawApplyProductAPI } from '../../../api/product.js'
import { ElMessage } from 'element-plus'

const productId = ref()

const props = defineProps<{
  getProductList: Function,
  GetProductApplyitList: Function
}>()

bus.on('withdrawId', (id) => {
  productId.value = id
})


const emit = defineEmits(['success'])

const WithdrawApplyProduct = async () => {
  const res = await WithdrawApplyProductAPI(productId.value)
  if (res.data.status == 0) {
    ElMessage({
      message: '撤回出库成功',
      type: 'success',
    })
    props.getProductList()
    props.GetProductApplyitList()
    dialogFormVisible.value = false
  } else {
    ElMessage.error('撤回出库失败')
    dialogFormVisible.value = false
  }
}

// 弹窗开关
const dialogFormVisible = ref(false)

// 打开编辑管理员的弹窗
const open = () => {
  dialogFormVisible.value = true
}

defineExpose({
  open
})

onBeforeUnmount(() => {
  bus.all.clear()
})
</script>

<style lang="scss" scoped></style>